<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Sign Up</title>
    <link rel="stylesheet" th:href="@{/css/signup.css}">
</head>
<body>

<div class="main">
    <section class="signup">
        <div class="container m-5" >
            <div class="signup-content">
                <form th:action="@{/user/create}" th:object="${user}" method="post" id="signup-form" class="signup-form">
                    <h2 class="form-title">Create an account</h2>
                    <div class="form-group">
                        <input type="text"  class="form-input" th:field="*{firstName}" name="firstname" id="firstname" placeholder="First Name" required/>
                    </div>
                    <div class="form-group">
                        <input type="text" class="form-input" th:field="*{lastName}" name="lastname" id="lastname" placeholder="Last Name"/>
                    </div>
                    <div class="form-group">
                        <input type="email"  class="form-input" th:field="*{userName}" name="email" id="email" placeholder="Your Email" required/>
                    </div>

                    <div class="form-group">
                        <input type="password"  class="form-input" th:field="*{password}" name="password" id="password" placeholder="Password" required/>
                    </div>
                    <div class="form-group">
                        <input type="password"  class="form-input" th:field="*{confirmPassword}" name="re_password" id="re_password" placeholder="Confirm password" required/>
                    </div>


                    <div class="form-group">
                        <input type="submit" name="submit" id="submit" class="form-submit" value="Sign up"/>
                    </div>
                </form>
                <p class="loginhere">
                    Have already an account? <a th:href="@{/login}" class="loginhere-link">Login here</a>
                </p>
            </div>
        </div>
    </section>
</div>


    <script th:src="@{/js/jquery.signup.js}"></script>
    <script th:src="@{/js/signup.js}"></script>
</body>
</html>